/* 自定义图标样式 */
.icon {
    display: inline-block;
    width: 1em;
    height: 1em;
    vertical-align: -0.125em;
    fill: currentColor;
}

.icon-sm {
    width: 0.875em;
    height: 0.875em;
}

.icon-lg {
    width: 1.33em;
    height: 1.33em;
}

.icon-xl {
    width: 1.5em;
    height: 1.5em;
}

.icon-circle {
    padding: 0.5rem;
    border-radius: 50%;
    background-color: var(--light-color);
    color: var(--primary-color);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 0.5rem;
}

.icon-circle.icon-primary {
    background-color: var(--primary-color);
    color: white;
}

.icon-circle.icon-success {
    background-color: var(--secondary-color);
    color: white;
}

.icon-circle.icon-info {
    background-color: var(--info-color);
    color: white;
}

.icon-circle.icon-warning {
    background-color: var(--warning-color);
    color: white;
}

.icon-circle.icon-danger {
    background-color: var(--danger-color);
    color: white;
}

/* 动画图标 */
.icon-spin {
    animation: spin 2s infinite linear;
}

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.icon-pulse {
    animation: pulse 1s ease-in-out infinite;
}

@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.2); }
    100% { transform: scale(1); }
} 